.mapboxgl-compare {
  background-color: #fff;
  position: absolute;
  width: 2px;
  height: 100%;
  z-index: 1;
}

.mapboxgl-compare .compare-swiper {
  background-color: #3887be;
  box-shadow: inset 0 0 0 2px #fff;
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  width: 60px;
  height: 60px;
  top: 50%;
  left: -30px;
  margin: -30px 1px 0;
  color: #fff;
  cursor: ew-resize;
  background-image: url();
}

.compare-map {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
}

.compare-left-map {
  position: absolute;
  left: 0;
  right: 50%;
  bottom: 0;
  top: 0;
  height: 100%;
  float: left;
}

.compare-right-map {
  position: absolute;
  left: 50%;
  right: 0;
  bottom: 0;
  top: 0;
  height: 100%;
  float: right;
}

 /*左测普通*/
.left-normal{
  position: absolute;
  width: 0;
  height: 0;
}
/*右侧测普通*/
.right-normal{
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
}

.compare-normal{
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
}





